<template>
  <div>
    <Row class="search-info-style">
        <Col span="6">
        <span style="text-al">开始时间：</span>
        <DatePicker type="date" placeholder="" style="width: 70%" v-model="searchInfo.start_time"></DatePicker>
        </Col>
        <Col span="6">
        <span>结束时间：</span>
        <DatePicker type="date" placeholder="" style="width: 70%" v-model="searchInfo.end_time"></DatePicker>
        </Col>
        <Col span="6" >
        <span>事项类型：</span>
            <Select v-model="searchInfo.ORG_ID" filterable transfer="" style="width: 70%;" @on-change="changeItem1(searchInfo.ORG_ID)">
               <Option :value="item.id" v-for="item in treelist" v-bind:key="item.id">{{item.type_name}}</Option>
            </Select>
        </Col>
        <Col span="6">
        <span>事项名称：</span>
            <Select v-model="searchInfo.item_id" filterable transfer="" style="width: 70%;">
                <Option :value="item.id" v-for="item in eventListSQ" v-bind:key="item.id">{{item.text}}</Option>
            </Select>
        </Col>
      <Button :loading="Excelloading" @click="importExcel()" style="float:right;margin-top:10px;margin-left: 10px" type="primary">
        <Icon type="md-arrow-round-down" /> 导出
      </Button>
      <Button @click="searchData()" style="float:right;margin-top:10px;margin-left: 10px" type="primary">
      <Icon type="ios-search" /> 搜索
      </Button>
    </Row>
    <Table ref="chile" border :columns="columns" :data="dataList">
    </Table>
    <Page class="page_style" :total="searchInfo.totalnum" :current="searchInfo.currentPageNo"
          :page-size="searchInfo.currentPageSize" @on-change="changePageNo" show-total  show-sizer @on-page-size-change="size"/>
  </div>
</template>
<script>
import { date2str, findItemStatisticsList, saveNoteBook, treelist, eventlistPC } from '@/api/eventlist'
export default {
  data () {
    return {
      treelist: [],
      infodisabled: false,
      paramData: {},
      show: false,
      Excelloading: false,
      itemList: [],
      columns: [
        { title: '序号', type: 'index', key: 'index', width: 100, align: 'center' },
        { title: '事项名称', key: 'title', align: 'center' },
        { title: '事项编号', key: 'item_id', align: 'center' },
        { title: '办件数量', key: 'sum', align: 'center' }
        // { title: '完成时间', key: 'complete_time', align: 'center' },
        // { title: '状态', slot: 'state', align: 'center' },
        // { title: '操作', slot: 'action', width: 250, align: 'center' }
      ],
      column1: [
        { title: '事项名称', key: 'title', align: 'center' },
        { title: '事项编号', key: 'item_id', align: 'center' },
        { title: '办件数量', key: 'sum', align: 'center' }
      ],
      dataList: [],
      searchInfo: {
        totalnum: 0,
        currentPageNo: 1,
        currentPageSize: 10,
        code: ''
      },
      eventListSC: [],
      eventListSQ: []

    }
  },
  methods: {
    aaa (item) {
      console.log(item)
    },
    init () {
      let param = {
        pageNo: this.searchInfo.currentPageNo,
        pageSize: this.searchInfo.currentPageSize,
        ORG_ID: this.searchInfo.ORG_ID,
        item_id: this.searchInfo.item_id,
        start_time: date2str(this.searchInfo.start_time),
        end_time: date2str(this.searchInfo.end_time)
      }
      findItemStatisticsList(param).then(res => {
        if (res.data.errcode === 0) {
          this.dataList = res.data.data.results
          this.searchInfo.totalnum = res.data.data.totalRecord
        } else {
          this.$Notice.error({ title: '获取列表失败', desc: res.data.errmsg })
        }
      })
    },
    searchData () {
      console.log(this.searchInfo)
      if ((this.searchInfo.start_time && this.searchInfo.end_time) || (!this.searchInfo.start_time && !this.searchInfo.end_time)) {
        console.log('222d')
      } else {
        this.$Message.error('请同时选择开始时间与结束时间')
        return
      }
      console.log(this.searchInfo)
      this.changePageNo(1)
    },
    showInfo (item) {
      this.paramData = this.$common.xeUtils.clone(item, true)
      this.show = true
      this.infodisabled = true
    },
    updateInfo (item) {
      this.paramData = this.$common.xeUtils.clone(item, true)
      this.show = true
      this.infodisabled = false
    },
    addInfo () {
      this.paramData = {}
      this.show = true
      this.infodisabled = false
    },
    finishInfo (item) {
      if (confirm('是否完成此待办事项，完成后不可修改')) {
        this.updateState(item, '1')
      }
    },
    remove (item) {
      if (confirm('是否删除此待办事项，删除后不可恢复')) {
        this.updateState(item, '2')
      }
    },
    updateOk () {
      this.updateState(this.paramData, '0')
    },
    updateState (item, state) {
      item.noteState = state
      this.itemList.forEach(function (temp) {
        if (temp.ITEM_CODE === item.item_id) {
          item.title = temp.QL_NAME
        }
      })
      saveNoteBook(item).then(res => {
        if (res.data.errcode === 0) {
          this.changePageNo(1)
          this.$Notice.success({ title: '操作完成', desc: '' })
        } else {
          this.$Notice.error({ title: '操作失败', desc: res.data.errmsg })
        }
      })
    },
    // getItemList () {
    //   getItemList().then(res => {
    //     if (res.data.errcode === 0) {
    //       this.itemList = res.data.data
    //     } else {
    //       this.$Notice.error({ title: '获取事项信息失败', desc: res.data.errmsg })
    //     }
    //   })
    // },
    size (pageSize) {
      this.searchInfo.currentPageSize = pageSize
      this.changePageNo(1)
    },
    changePageNo (pageNo) {
      this.searchInfo.currentPageNo = pageNo
      this.init()
    },
    getTreeList () {
      treelist({}).then(res => {
        if (res.data.errcode === 0) {
          this.treelist = res.data.data
          this.treelist.unshift({ id: '', type_name: '全部' })
          this.$forceUpdate()
        } else {
          this.$Notice.error({ title: '获取信息失败', desc: '查询事项类型列表失败' })
        }
      })
    },
    changeItem1 (item_type) {
      let that = this
      that.eventListSQ = []
      that.eventListSC.forEach(function (temp1, index) {
        if (temp1.org_code === item_type) {
          that.eventListSQ.push(temp1)
        }
      })
      that.eventListSQ.unshift({ id: 0, text: '全部' })
    },
    getItemList () {
      eventlistPC({}).then(res => {
        if (res.data.errcode === 0) {
          this.eventListSC = res.data.data
          this.eventListSC.unshift({ id: 0, text: '全部' })
          this.$forceUpdate()
        } else {
          this.$Notice.error({ title: '获取信息失败', desc: '查询事项劣列表失败' })
        }
      })
    },
    importExcel () {
      this.Excelloading = true
      let param = {
        pageNo: 1,
        pageSize: 200,
        ORG_ID: this.searchInfo.ORG_ID,
        item_id: this.searchInfo.item_id,
        start_time: date2str(this.searchInfo.start_time),
        end_time: date2str(this.searchInfo.end_time)
      }
      findItemStatisticsList(param).then(res => {
        if (res.data.errcode === 0) {
          this.$refs.chile.exportCsv({
            filename: '台账统计',
            columns: this.column1,
            data: res.data.data.results.map(k => {
              k.item_id = '\t' + k.item_id
              return k
            })
          })
          this.Excelloading = false
        } else {
          this.$Notice.error({
            title: '导出失败！',
            desc: res.data.errmsg
          })
        }
      })
    }
  },
  mounted () {
    this.init()
    this.getTreeList()
    this.getItemList()
  }
}
</script>
<style>
.page_style {
  margin-top: 10px;
  text-align: right;
}
.search-info-style {
  margin: 10px;
}
</style>
